<template>
	<view class="container">
		<u-loading-page mode="flower" :show="loadingShow"></u-loading-page>
		<view v-if="listData.length == 0" style="padding-top: 30rpx">
			<u-empty mode="list" text="暂无待审核列表"></u-empty>
		</view>
		<view class="warp" v-if="listData.length > 0">
			<view class="item" v-for="(item, index) in listData" :key="index">
				<view class="item_item">
					<view class="itemTop">
						<view class="left">
							<image :src="item.avatar" style="width: 84rpx; height: 84rpx; border-radius: 100%"></image>
						</view>
						<view class="center">
							<view class="name">
								{{ item.nickname }}
							</view>
							<view class="phone">
								{{ item.mobile }}
							</view>
						</view>
						<view class="right">+{{ item.cz_money }}</view>
					</view>
					<view class="list" v-for="(key, i) in item.recharge" :key="i">
						<view class="list-content">{{ key.shopname }}</view>
						<view class="list-content">+{{ Number(key.money).toFixed(2) }}</view>
					</view>
					<view class="itemDir"></view>
					<view class="itemBottom">
						<view class="left">提交日期：{{ item.subtime }}</view>
						<view class="right">
							<view class="btn" @click="audit(item)">审核</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<u-modal
			:show="showAudit"
			confirmText="同意"
			cancelText="拒绝"
			confirmColor="#EBBE87"
			cancelColor="#C2514A"
			:show-title="false"
			:showCancelButton="true"
			:title="type == 1 ? '充值提前到账是否同意？' : '订单充值赠送/调整审核是否同意？'"
			@confirm="passAudit"
			@cancel="refuseAudit"
		></u-modal>
	</view>
</template>
<script>
export default {
	data() {
		return {
			type: 1,
			loadingShow: false,
			listData: [],
			shopId: uni.getStorageSync('shopId'),

			showAudit: false,
			this_item: {}
		};
	},
	onLoad(option) {
		this.type = option.type;
		this.shopId = option.shopId;
		if (this.type == 1) {
			uni.setNavigationBarTitle({
				title: '充值提前到账审核'
			});
		}
		this.listData = [];
		this.getListData();
	},
	onReachBottom() {
		if (this.pageNum < this.lastPage) {
			this.pageNum++;
			this.getDetailData();
		} else {
			this.$wanlshop.msg('我是有底线的');
		}
	},
	methods: {
		getListData() {
			this.loadingShow = true;
			let type = '1';
			if (this.type == 1) {
				uni.setNavigationBarTitle({
					title: '充值提前到账审核'
				});
				type = '2';
			}
			this.$request({
				url: 'Manage/cz_verify',
				method: 'post',
				data: {
					shop_id: this.shopId,
					form: '1',
					type: type,
					key: this.keyword
				}
			})
				.then((res) => {
					const { code, data } = res.data;
					if (code == 1) {
						this.listData = this.listData.concat(data.list.data);
						this.loadingShow = false;
					}
				})
				.catch((e) => {
					this.loadingShow = false;
				});
		},
		handleSuccess(item) {
			this.$request({
				url: 'Manage/record_verify',
				method: 'post',
				data: {
					id: item.id,
					status: '1'
				}
			}).then((res) => {
				if (res.data.code == 1) {
					this.showAudit = false;
					uni.showToast({
						icon: 'success',
						title: '审核成功'
					});
					this.listData = [];
					this.getListData();
				} else {
					uni.showToast({
						icon: 'error',
						title: res.data.msg
					});
					this.showAudit = false;
				}
			});
		},
		handleError(item) {
			this.$request({
				url: 'Manage/record_verify',
				method: 'post',
				data: {
					id: item.id,
					status: '2'
				}
			}).then((res) => {
				if (res.data.code == 1) {
					this.showAudit = false;
					uni.showToast({
						icon: 'success',
						title: '驳回成功'
					});
					this.listData = [];
					this.getListData();
				} else {
					uni.showToast({
						icon: 'error',
						title: res.data.msg
					});
					this.showAudit = false;
				}
			});
		},
		passAudit() {
			let item = this.this_item;
			this.handleSuccess(item);
		},
		refuseAudit() {
			let item = this.this_item;
			this.handleError(item);
		},
		audit(item) {
			let that = this;
			this.this_item = item;
			this.showAudit = true;
		}
	}
};
</script>

<style lang="scss">
page {
	background-color: #f4f5f9;
}

.container {
	background-color: #fff;
	width: 100%;
}

.warp {
	padding: 0 34rpx;
}

.item {
	padding-top: 20rpx;
	padding-bottom: 20rpx;
	border-top: 2px solid #f4f5f9;

	.item_item {
		width: 100%;

		.itemTop {
			display: flex;
			align-items: center;

			.left {
				width: 100rpx;
			}

			.center {
				flex: 1;

				.name {
					font-family: AppleSystemUIFont;
					font-size: 30rpx;
					color: #333333;
				}

				.phone {
					padding-top: 8rpx;
					font-family: AppleSystemUIFont;
					font-size: 26rpx;
					color: #999999;
				}
			}

			.right {
				width: 200rpx;
				text-align: right;
				font-family: PingFangSC, PingFang SC;
				font-weight: bold;
				font-size: 35rpx;
				color: #ff3f4a;
			}
		}
		.list {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 20rpx;
			&-content {
				height: 32rpx;
				line-height: 32rpx;
				font-size: 26rpx;
				color: #999;
			}
		}
		.itemDir {
			margin-top: 10rpx;
			width: 100%;
			height: 4rpx;
			background: #f4f5f9;
		}

		.itemBottom {
			margin-top: 20rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			.left {
				flex: 1;
				width: 50%;
				font-size: 26rpx;
				color: #999;
				margin-top: 14rpx;
			}

			.right {
				display: flex;

				.btn {
					width: 92rpx;
					height: 52rpx;
					background: linear-gradient(154deg, #e4b77f 0%, #cd9c61 100%);
					border-radius: 8rpx;
					text-align: center;
					line-height: 52rpx;
					font-size: 26rpx;
					color: #fff;
					margin-left: 10px;
				}

				.btn_refuse {
					width: 92rpx;
					height: 52rpx;
					border-radius: 8rpx;
					text-align: center;
					line-height: 52rpx;
					font-size: 26rpx;
					color: #999;
					margin-left: 20px;
				}
			}
		}
	}
}
</style>
